<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
<!-- 		<script type="text/jscript" src="../js/jquery-1.7.2.min.js"></script> -->
<!-- 		<link rel="stylesheet" type="text/css" href="../css/index2e424c.css"> -->
<!-- 		<link rel="stylesheet" type="text/css" href="../css/emoji2c1a46.css"> -->
<!-- 		<link rel="stylesheet" type="text/css" href="../css/jquery.scrollbar2dd78f.css"> -->
			<script type="text/jscript" src="js/jquery-1.7.2.min.js"></script>
		<link rel="stylesheet" type="text/css" href="css/index2e424c.css">
		<link rel="stylesheet" type="text/css" href="css/emoji2c1a46.css">
		<link rel="stylesheet" type="text/css" href="css/jquery.scrollbar2dd78f.css">
	</head>
	<body>
		<div id="app" class="body">
	<div class="main" data-reactid=".0">
		<div class="mask" style="display: none;" data-reactid=".0.0"></div>
		<div style="display:none;" data-reactid=".0.1">
			<div class="mask" style="display:none;" data-reactid=".0.1.0"></div>
			<div class="pic_view" data-reactid=".0.1.1"></div>
		</div>
		<div style="display:none;" data-reactid=".0.2">
			<div class="mask" style="display:none;" data-reactid=".0.2.0"></div>
			<div class="screenshot" style="left: 50%; top: 50%; margin-left: 0px; margin-top: 0px;" data-reactid=".0.2.1">
				<div class="shot_body" data-reactid=".0.2.1.0"></div>
				<div class="shot_footer" data-reactid=".0.2.1.1">
					<div class="btn_wrap" data-reactid=".0.2.1.1.0">
						<a class="btn btn_primary" data-reactid=".0.2.1.1.0.0">发送</a>
						<a class="btn" data-reactid=".0.2.1.1.0.1">取消</a>
					</div>
				</div>
			</div>
		</div>
		<div class="loading_popup" style="display: none;" data-reactid=".0.3"><span data-reactid=".0.3.0"><div class="spinner" role="progressbar" style="position: absolute; width: 0px; z-index: 2000000000; left: 50%; top: 50%;"><div style="position: absolute; top: -1px; opacity: 0.25; animation: opacity-100-25-0-12 1s linear infinite;"><div style="position: absolute; width: 7px; height: 2px; box-shadow: rgba(0, 0, 0, 0.0980392) 0px 0px 1px; transform-origin: left center 0px; transform: rotate(0deg) translate(6px, 0px); border-radius: 1px; background: rgb(255, 255, 255);"></div></div><div style="position: absolute; top: -1px; opacity: 0.25; animation: opacity-100-25-1-12 1s linear infinite;"><div style="position: absolute; width: 7px; height: 2px; box-shadow: rgba(0, 0, 0, 0.0980392) 0px 0px 1px; transform-origin: left center 0px; transform: rotate(30deg) translate(6px, 0px); border-radius: 1px; background: rgb(255, 255, 255);"></div></div><div style="position: absolute; top: -1px; opacity: 0.25; animation: opacity-100-25-2-12 1s linear infinite;"><div style="position: absolute; width: 7px; height: 2px; box-shadow: rgba(0, 0, 0, 0.0980392) 0px 0px 1px; transform-origin: left center 0px; transform: rotate(60deg) translate(6px, 0px); border-radius: 1px; background: rgb(255, 255, 255);"></div></div><div style="position: absolute; top: -1px; opacity: 0.25; animation: opacity-100-25-3-12 1s linear infinite;"><div style="position: absolute; width: 7px; height: 2px; box-shadow: rgba(0, 0, 0, 0.0980392) 0px 0px 1px; transform-origin: left center 0px; transform: rotate(90deg) translate(6px, 0px); border-radius: 1px; background: rgb(255, 255, 255);"></div></div><div style="position: absolute; top: -1px; opacity: 0.25; animation: opacity-100-25-4-12 1s linear infinite;"><div style="position: absolute; width: 7px; height: 2px; box-shadow: rgba(0, 0, 0, 0.0980392) 0px 0px 1px; transform-origin: left center 0px; transform: rotate(120deg) translate(6px, 0px); border-radius: 1px; background: rgb(255, 255, 255);"></div></div><div style="position: absolute; top: -1px; opacity: 0.25; animation: opacity-100-25-5-12 1s linear infinite;"><div style="position: absolute; width: 7px; height: 2px; box-shadow: rgba(0, 0, 0, 0.0980392) 0px 0px 1px; transform-origin: left center 0px; transform: rotate(150deg) translate(6px, 0px); border-radius: 1px; background: rgb(255, 255, 255);"></div></div><div style="position: absolute; top: -1px; opacity: 0.25; animation: opacity-100-25-6-12 1s linear infinite;"><div style="position: absolute; width: 7px; height: 2px; box-shadow: rgba(0, 0, 0, 0.0980392) 0px 0px 1px; transform-origin: left center 0px; transform: rotate(180deg) translate(6px, 0px); border-radius: 1px; background: rgb(255, 255, 255);"></div></div><div style="position: absolute; top: -1px; opacity: 0.25; animation: opacity-100-25-7-12 1s linear infinite;"><div style="position: absolute; width: 7px; height: 2px; box-shadow: rgba(0, 0, 0, 0.0980392) 0px 0px 1px; transform-origin: left center 0px; transform: rotate(210deg) translate(6px, 0px); border-radius: 1px; background: rgb(255, 255, 255);"></div></div><div style="position: absolute; top: -1px; opacity: 0.25; animation: opacity-100-25-8-12 1s linear infinite;"><div style="position: absolute; width: 7px; height: 2px; box-shadow: rgba(0, 0, 0, 0.0980392) 0px 0px 1px; transform-origin: left center 0px; transform: rotate(240deg) translate(6px, 0px); border-radius: 1px; background: rgb(255, 255, 255);"></div></div><div style="position: absolute; top: -1px; opacity: 0.25; animation: opacity-100-25-9-12 1s linear infinite;"><div style="position: absolute; width: 7px; height: 2px; box-shadow: rgba(0, 0, 0, 0.0980392) 0px 0px 1px; transform-origin: left center 0px; transform: rotate(270deg) translate(6px, 0px); border-radius: 1px; background: rgb(255, 255, 255);"></div></div><div style="position: absolute; top: -1px; opacity: 0.25; animation: opacity-100-25-10-12 1s linear infinite;"><div style="position: absolute; width: 7px; height: 2px; box-shadow: rgba(0, 0, 0, 0.0980392) 0px 0px 1px; transform-origin: left center 0px; transform: rotate(300deg) translate(6px, 0px); border-radius: 1px; background: rgb(255, 255, 255);"></div></div><div style="position: absolute; top: -1px; opacity: 0.25; animation: opacity-100-25-11-12 1s linear infinite;"><div style="position: absolute; width: 7px; height: 2px; box-shadow: rgba(0, 0, 0, 0.0980392) 0px 0px 1px; transform-origin: left center 0px; transform: rotate(330deg) translate(6px, 0px); border-radius: 1px; background: rgb(255, 255, 255);"></div></div></div></span>
			<p data-reactid=".0.3.1">加载中</p>
		</div><span data-reactid=".0.4"></span>
		<div class="main_content" data-reactid=".0.5">
			<div class="main_header" data-reactid=".0.5.0">
				<div class="tab" data-reactid=".0.5.0.0">
					<div class="tab_item tab_item_selected" data-reactid=".0.5.0.0.0"><span class="chat_item_icon" data-reactid=".0.5.0.0.0.0"></span><span data-reactid=".0.5.0.0.0.1">0</span><span data-reactid=".0.5.0.0.0.2">人待回复</span></div>
					<div class="tab_item" data-reactid=".0.5.0.0.1"><span class="wait_item_icon " data-reactid=".0.5.0.0.1.0"></span><span data-reactid=".0.5.0.0.1.1">0</span><span data-reactid=".0.5.0.0.1.2">人待接入</span></div>
					<div class="tab_item tab_item_right " data-reactid=".0.5.0.0.2"><span class="setting_item_icon" data-reactid=".0.5.0.0.2.0"></span></div>
				</div>
				<div class="state" data-reactid=""><span class="state_icon online" data-reactid=".0.5.0.1.0"></span><span class="state_description" data-reactid="">神工小秘001</span></div>
				<div class="set_state_popup" style="display:none;" data-reactid=".0.5.0.2">
					<div class="state_pic_wrap" data-reactid=".0.5.0.2.0"><img src="https://mmbiz.qpic.cn/mmbiz/FpUq8JQOkoHvdQoUrS1owUBAGA0LDK5QrzojnORCFWNF3HBG6U3tCB08nKnuDhAvysCruEEFNcicjTd7JRFe0og/300?wx_fmt=jpeg/132" alt="avatar" data-reactid=".0.5.0.2.0.0"></div>
					<div class="set_state_lists" data-reactid=".0.5.0.2.1">
						<ul data-reactid=".0.5.0.2.1.0">
							<li class="set_state_list selected" data-reactid=""><span class="state_icon online" data-reactid=""></span><span data-reactid="">在线</span></li>
							<li class="set_state_list" data-reactid=""><span class="state_icon leave" data-reactid=""></span><span data-reactid="">离开</span></li>
							<li class="set_state_list" data-reactid=""><span class="state_icon exit" data-reactid=""></span><span data-reactid="">退出</span></li>
						</ul>
					</div>
				</div>
			</div>
			<div class="main_body" data-reactid=".0.5.1">
				<div class="chat_wrap" style="display:block;" data-reactid=".0.5.1.0">
					<div class="panel" data-reactid=".0.5.1.0.0">
						<div class="scroll-wrapper scrollbar-macosx" style="position: relative; height: 100%;">
							<div class="scrollbar-macosx scroll-content" data-reactid=".0.5.1.0.0.0" style="height: 700px; margin-bottom: 0px; margin-right: 0px; max-height: none;">
								<div class="card card_selected" data-reactid="1001" destination='1001' destinationType='0' chatId='100001'>
									<div class="card_pic" data-reactid=""><img src="http://wx.qlogo.cn/mmhead/XjIAsftic1YBgFibSxvT4WUZyxz6fibNpLIxiagaNJkNcWw/132" alt="孙晓光" data-reactid=""></div>
									<div class="card_content" data-reactid="">
										<div class="chat_content_header" data-reactid=""><span class="card_content_nick" title="孙晓光" data-reactid="">孙晓光</span><span class="card_message_state" style="display:none;" data-reactid="">0</span></div>
										<div class="card_content_chat" data-reactid="">
											<p class="card_content_detail" data-reactid="">webSocket&nbsp;</p><span class="card_content_time" data-reactid="">前天</span></div>
									</div>
								</div>
								<div class="card" data-reactid="1002" destination='1002' destinationType='0' chatId='100002'>
									<div class="card_pic" data-reactid=""><img src="http://wx.qlogo.cn/mmhead/Q3auHgzwzM71U2JfRG4l1oOnQzPS1Ckz76UDDcV0IoUb5g5kO6G1Ng/132" alt="一步十步。。" data-reactid=""></div>
									<div class="card_content" data-reactid="">
										<div class="chat_content_header" data-reactid=""><span class="card_content_nick" title="一步十步。。" data-reactid="">一步十步。。</span><span class="card_message_state" style="display:none;" data-reactid="">0</span></div>
										<div class="card_content_chat" data-reactid="">
											<p class="card_content_detail" data-reactid="">你好吗</p><span class="card_content_time" data-reactid="">昨天</span></div>
									</div>
								</div>
								<div class="card" data-reactid="1003" destination='1003' destinationType='0' chatId='100003'>
									<div class="card_pic" data-reactid=""><img src="http://wx.qlogo.cn/mmhead/DmTSLTdleeslFhU7AvIwmJaOvHYcbjwZSCHtmIXBBebRbzeodnIG3w/132" alt="Sunshine" data-reactid=""></div>
									<div class="card_content" data-reactid="">
										<div class="chat_content_header" data-reactid=""><span class="card_content_nick" title="Sunshine" data-reactid="">Sunshine</span><span class="card_message_state" style="display:none;" data-reactid="">0</span></div>
										<div class="card_content_chat" data-reactid="">
											<p class="card_content_detail" data-reactid="">您好！请问有什么可以帮到你呢？</p><span class="card_content_time" data-reactid="">昨天</span></div>
									</div>
								</div>
								<div class="card" data-reactid="1004" destination='1004' destinationType='0' chatId='100004'>
									<div class="card_pic" data-reactid=""><img src="http://wx.qlogo.cn/mmhead/PiajxSqBRaELicJgMo6cWtnExLp5sqrAsLI0ibaGqSIktRN2DgcF0rlaw/132" alt="卡卡兰君" data-reactid=""></div>
									<div class="card_content" data-reactid="">
										<div class="chat_content_header" data-reactid=""><span class="card_content_nick" title="卡卡兰君" data-reactid="">卡卡兰君</span><span class="card_message_state" style="display:none;" data-reactid="">0</span></div>
										<div class="card_content_chat" data-reactid="">
											<p class="card_content_detail" data-reactid=""><img src="//res.wx.qq.com/mpkf/zh_CN/images/icon/emotion/79.gif" width="24" height="24"></p><span class="card_content_time" data-reactid="">昨天</span></div>
									</div>
								</div>
								<div class="card" data-reactid="1005" destination='1005' destinationType='0' chatId='100005'>
									<div class="card_pic" data-reactid=""><img src="http://wx.qlogo.cn/mmhead/Q3auHgzwzM5A073S2XvhWYdUPhibQjcZibRztZSPHWicOm9lIeJmVYC2A/132" alt="刚仔" data-reactid=""></div>
									<div class="card_content" data-reactid="">
										<div class="chat_content_header" data-reactid=""><span class="card_content_nick" title="刚仔" data-reactid=".0.5.1.0.0.0.$1080344621.1.0.0">刚仔</span><span class="card_message_state" style="display:none;" data-reactid="">0</span></div>
										<div class="card_content_chat" data-reactid="">
											<p class="card_content_detail" data-reactid=""><img src="//res.wx.qq.com/mpkf/zh_CN/images/icon/emotion/13.gif" width="24" height="24"></p><span class="card_content_time" data-reactid="">昨天</span></div>
									</div>
								</div>
								<div class="card" data-reactid="1006" destination='1006' destinationType='0' chatId='100005'>
									<div class="card_pic" data-reactid=""><img src="http://wx.qlogo.cn/mmhead/Q3auHgzwzM6sNs6oAAYhVicpFU5ICSwyvgt4G3dTA9BZHcutqZp48jA/132" alt="兼程不却步。。" data-reactid=""></div>
									<div class="card_content" data-reactid="">
										<div class="chat_content_header" data-reactid=""><span class="card_content_nick" title="兼程不却步。。" data-reactid="">兼程不却步。。</span><span class="card_message_state" style="display:none;" data-reactid="">0</span></div>
										<div class="card_content_chat" data-reactid="">
											<p class="card_content_detail" data-reactid="">客服不在</p><span class="card_content_time" data-reactid="">昨天</span></div>
									</div>
								</div>
							</div>
							<div class="scroll-element scroll-x">
								<div class="scroll-element_outer">
									<div class="scroll-element_size"></div>
									<div class="scroll-element_track"></div>
									<div class="scroll-bar" style="width: 96px;"></div>
								</div>
							</div>
							<div class="scroll-element scroll-y">
								<div class="scroll-element_outer">
									<div class="scroll-element_size"></div>
									<div class="scroll-element_track"></div>
									<div class="scroll-bar" style="height: 96px;"></div>
								</div>
							</div>
						</div>
					</div>
						<div class="chat " data-reactid=".0.5.1.0.2.0">
							<div class="chat_header" data-reactid=".0.5.1.0.2.0.0">
								<div class="chat_header_items" data-reactid=".0.5.1.0.2.0.0.0"><span class="chat_header_name" data-reactid=".0.5.1.0.2.0.0.0.0">当前对话</span>
									<div class="chat_header_icons" data-reactid=".0.5.1.0.2.0.0.0.1"><span class="chat_header_icon transfer" data-reactid=".0.5.1.0.2.0.0.0.1.0"></span><span id="close_session" class="chat_header_icon exit" data-reactid=".0.5.1.0.2.0.0.0.1.1"></span>
										<a class="tip tip_top" style="position:fixed;left:0;top:0;display:none;" data-reactid=".0.5.1.0.2.0.0.0.1.2">结束会话</a>
									</div>
								</div>
							</div>
							<div class="scroll-wrapper chat_body scrollbar-macosx" style="position: relative;">
								<div class="chat_body scrollbar-macosx scroll-content scroll-scrolly_visible" data-reactid="" style="height: auto; margin-bottom: 0px; margin-right: 0px; max-height: 495px;">
									<div class="chat_body_inner" data-reactid="">
											<!-- <noscript data-reactid=".0.5.1.0.2.0.1.0.1"></noscript> --></div>
								</div>
								<div class="scroll-element scroll-x scroll-scrolly_visible">
									<div class="scroll-element_outer">
										<div class="scroll-element_size"></div>
										<div class="scroll-element_track"></div>
										<div class="scroll-bar" style="width: 89px;"></div>
									</div>
								</div>
								<div class="scroll-element scroll-y scroll-scrolly_visible">
									<div class="scroll-element_outer">
										<div class="scroll-element_size"></div>
										<div class="scroll-element_track"></div>
										<div class="scroll-bar" style="height: 183px; top: 308px;"></div>
									</div>
								</div>
							</div>
							<div class="chat_edit" style="display: block;" data-reactid=".0.5.1.0.2.0.2">
								<div class="chat_edit_items" data-reactid=".0.5.1.0.2.0.2.0">
								</div>
								<div class="chat_edit_input" data-reactid=".0.5.1.0.2.0.2.1">
									<div class="scroll-wrapper edit_area scrollbar-macosx" style="position: relative;"><pre id="editor" class="edit_area scrollbar-macosx scroll-content" contenteditable="true" data-reactid=".0.5.1.0.2.0.2.1.0" style="height: 80px; margin-bottom: 0px; margin-right: 0px; max-height: none;"></pre>
										<div class="scroll-element scroll-x">
											<div class="scroll-element_outer">
												<div class="scroll-element_size"></div>
												<div class="scroll-element_track"></div>
												<div class="scroll-bar" style="width: 96px;"></div>
											</div>
										</div>
										<div class="scroll-element scroll-y">
											<div class="scroll-element_outer">
												<div class="scroll-element_size"></div>
												<div class="scroll-element_track"></div>
												<div class="scroll-bar" style="height: 96px;"></div>
											</div>
										</div>
									</div>
								</div>
								<div class="chat_edit_footer" data-reactid="">按Enter发送，Ctrl+Enter换行</div>
							</div>
						</div><span data-reactid=""></span>
				</div>
			</div>
		</div>
	</div>
</div>
	</body>
	<script>
	var httpBasePath='';
	var wsBasePath='';
	var userId='';
	var websocket = null;
	var user;
	  function synccheck(userId,baseUrl) {
	 	//判断当前浏览器是否支持WebSocket
	 	if ('WebSocket' in window) {
	 		console.log(baseUrl);
	 		websocket = new WebSocket(baseUrl+"websocket/"+userId);
	 	} else {
	 		alert('Not support websocket')
	 	}

	 	//连接发生错误的回调方法
	 	websocket.onerror = function() {
	 	};

	 	//连接成功建立的回调方法
	 	websocket.onopen = function(event) {
	 		console.log(event);
	 	}

	 	//接收到消息的回调方法
	 	websocket.onmessage = function(event) {
	 		console.log(event);
	 		console.log(event.data);
	 		var data=JSON.parse(event.data);
	 		console.log(data);
	 		if(data.msg_type=='10'){
	 			getMessage();
	 		}
// 	 		getMsg();
	 	}

	 	//连接关闭的回调方法
	 	websocket.onclose = function() {
	 	}


	 	//关闭连接
	 	function closeWebSocket() {
	 		websocket.close();
	 	}
	 }
		jQuery(function(){
			//处理登陆
			dealLogin();
			//点击会话
			jQuery('.panel').on('click','.card',function(){
				var cards=$(this).parent().find('.card');
				$(cards).each(function(){
					$(this).removeClass('card_selected');
				})
				$(this).addClass('card_selected');
				var chatId=$(this).attr('chatId');
				var destination=$(this).attr('destination');
				var destinationType=$(this).attr('destinationType');
				var chat_body_inner= $('.chat .chat_body_inner').html('');
				getMessageByAjax(chatId, destinationType, destination);
				/* $.ajax({
					url:httpBasePath+'user/getMessageByChatId',
					type:'post',
					dataType:'json',
					data:{'chatId':chatId},
					success:function(msg){
						console.log(msg);
						var contents=msg.data;
						var chat_body_inner= $('.chat .chat_body_inner').html('');
						$('.chat').attr('destinationType',destinationType).attr('destination',destination).attr('chatId',chatId);
						if(contents){
							for(var i=0;i<contents.length;i++){
								var chatContent=contents[i];
								console.log(chatContent);
								var message_boc=$('<div>').attr('class','message_box');
								var message_box_pic=$('<div>').attr('class','mssage_box_pic').html(chatContent.origin);
								var message_conent=$('<div>').attr('class','message_content');
								var message_content_inner=$('<p>').attr('class','message_content_inner').html(chatContent.content);
								message_conent.append(message_content_inner);
								message_boc.append(message_box_pic);
								message_boc.append(message_conent);
								$('.chat_body_inner').append(message_boc);
							}
						}
					}
				}); */
			});
			//发送消息
			jQuery('.chat').on('keydown',function(event){
				var keyCode=event.keyCode;
				if(keyCode=='13'){
					var editor=$('.chat_edit_input').find('#editor');
					var content=editor.html();
					if(!content){
						editor.html('');
						return; 
					}
					var chatId=$('.chat').attr('chatId');;
					var contentType='0';
					var destination=$('.chat').attr('destination');
					var destinationType=$('.chat').attr('destinationType');
					$.ajax({
						url:httpBasePath+"user/sendMessage",
						data:{'destination':destination,'destinationType':destinationType,'chatId':chatId,'contentType':'0','content':content},
						dataType:'json',
						type:'post',
						success:function(msg){
							editor.html('');
							var message_boc=$('<div>').attr('class','message_box').addClass('from_self');
							var message_box_pic=$('<div>').attr('class','mssage_box_pic').html('me');
							var message_conent=$('<div>').attr('class','message_content');
							var message_content_inner=$('<p>').attr('class','message_content_inner').html(content);
							message_conent.append(message_content_inner);
							message_boc.append(message_box_pic);
							message_boc.append(message_conent);
							$('.chat_body_inner').append(message_boc);
						}
					});
				}
			})
			jQuery('.main').on('click','#login_input',function(){
				var userCode=$('#userCode').val();
				$.ajax({
					url:'user/login',
					type:'post',
					data:{'userCode':userCode},
					dataType:'json',
					success:function(msg){
						console.log(msg);
						if(msg.status=='SUCCESS'){
							httpBasePath=msg.httpBaseUrl;
							wsBasePath=msg.wsBaseUrl;
							userId=msg.userId;
							user=msg.user;
							$('#login_div').css('display','none');
							jQuery('.main_content').css('display','');
							//建立长链接
							console.log(wsBasePath);
							$('.state_description').html(user.userName);
							synccheck(userId,wsBasePath);
							getChatVOs();
							
						}else{
							console.log('账户不存在');
							var errDiv=$('div').attr('id','err_div').html('账户不存在,请重新输入');
							$('#login_div').append(errDiv);
						}
					}
				});
			});
		});
		function dealLogin(){
			jQuery('.main_content').css('display','none');
			var user= jQuery('<input>').attr('type','text').attr('id','userCode');
			var submit=jQuery('<input>').attr('type','submit').attr('id','login_input').attr('value','登陆');
			var div=jQuery('<div>').attr('id','login_div');
			div.append(user).append(submit)
			jQuery('.main_content').parent().append(div);
		}
		function getMessage(){
			var chatId=$('.chat').attr('chatId');
			var destinationType=$('.chat').attr('destinationType');
			var destination=$('.chat').attr('destination');
			getMessageByAjax(chatId, destinationType, destination);
		}
		function getMessageByAjax(chatId,destinationType,destination){
			$.ajax({
				url:httpBasePath+'user/getMessageByChatId',
				type:'post',
				dataType:'json',
				data:{'chatId':chatId},
				success:function(msg){
					console.log(msg);
					var contents=msg.data;
					/* var chat_body_inner= $('.chat .chat_body_inner').html(''); */
					$('.chat').attr('destinationType',destinationType).attr('destination',destination).attr('chatId',chatId);
					if(contents){
						for(var i=0;i<contents.length;i++){
							var chatContent=contents[i];
							console.log(chatContent);
							var message_boc=$('<div>').attr('class','message_box');
							var message_box_pic=$('<div>').attr('class','mssage_box_pic').html(chatContent.origin);
							var message_conent=$('<div>').attr('class','message_content');
							var message_content_inner=$('<p>').attr('class','message_content_inner').html(chatContent.content);
							message_conent.append(message_content_inner);
							message_boc.append(message_box_pic);
							message_boc.append(message_conent);
							$('.chat_body_inner').append(message_boc);
						}
					}
				}
			});
		}
		//左侧增加条目
		function insertLeft(card){
			$('.panel').find('.scroll-content').append(card);
		}
		function getChatVOs(){
			$.ajax({
				url:httpBasePath+'user/getChatVOsByUserId',
				type:'post',
				dataType:'json',
				success:function(msg){
					console.log(msg);
					if(msg.status=='SUCCESS'){
						var data=msg.data;
						$('.panel').find('.scroll-content').html('');
						for(var i=0;i<data.length;i++){
							var chatId=data[i].id;
							var targUser=data[i].targUser;
							console.log(targUser);
							var card=$('<div>').attr('class','card').attr('destination',targUser.id).attr('destinationType',targUser.userType).attr('chatId',chatId);
							var imgUrl='<img src="http://wx.qlogo.cn/mmhead/XjIAsftic1YBgFibSxvT4WUZyxz6fibNpLIxiagaNJkNcWw/132" alt="" data-reactid="">';
							var card_pic=$('<div>').attr('class','card_pic').html(imgUrl);
							var card_content=$('<div>').attr('class','card_content');
							var chat_content_header=$('<div>').attr('class','chat_content_header');
							var card_content_nick=$('<span>').attr('class','card_content_nick').attr('title',targUser.userName).html(targUser.userName);
							chat_content_header.append(card_content_nick);
							card_content.append(chat_content_header);
							card.append(card_pic);
							card.append(card_content);
							insertLeft(card);
						}
					}
					/* <div class="card card_selected" data-reactid="1001" destination='1001' destinationType='0' chatId='100001'>
					<div class="card_pic" data-reactid=""><img src="http://wx.qlogo.cn/mmhead/XjIAsftic1YBgFibSxvT4WUZyxz6fibNpLIxiagaNJkNcWw/132" alt="孙晓光" data-reactid=""></div>
					<div class="card_content" data-reactid="">
						<div class="chat_content_header" data-reactid=""><span class="card_content_nick" title="孙晓光" data-reactid="">孙晓光</span><span class="card_message_state" style="display:none;" data-reactid="">0</span></div>
						<div class="card_content_chat" data-reactid="">
							<p class="card_content_detail" data-reactid="">webSocket&nbsp;</p><span class="card_content_time" data-reactid="">前天</span></div>
					</div>
				</div> */
				}
			});
			
		}
	</script>
</html>
